<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="vue.js" type="text/javascript"></script>
		<script src="axios.min.js" type="text/javascript"></script>
	</head>
	<body>
		<div id="app">
			分类：<select v-model="itemCategoryId">
				<option v-for="category in categoryList" 
				v-bind:value="category.categoryId">
				{{category.categoryName}}
				</option>
			</select>
			<br>
			商品名称:<input v-model="item.itemName" />
			<br>
			价格:<input v-model="item.itemPrice" />
			<br>
			描述:<input v-model="item.itemDesc" />
			<br>
			图片:<input v-model="item.itemImage" />
			<button v-on:click="update">修改</button>
			
			
		</div>
	</body>
	<script>
		var config={
			el:"#app",
			data:{
				categoryList:[],
				itemCategoryId:null,
				item:null
			},
			methods:{
				update:function(){
					var serverUrl="http://localhost:1314/item/update?"
					+"itemId="+this.item.itemId
					+"&categoryId="+this.itemCategoryId
					+"&itemName="+this.item.itemName
					+"&itemPrice="+this.item.itemPrice
					+"&itemDesc="+this.item.itemDesc
					+"&itemImage="+this.item.itemImage;
					//update.html?itemId=2
					//console拷贝url到浏览器
					console.log(serverUrl);
					axios.get(serverUrl)
					.then(function(res){
						window.alert(res.data);
						//让浏览器访问item.html
						location.href="item.html";
					})
					.catch();
				},
				findItemById:function(itemId){
					debugger;
					var serverUrl="http://localhost:1314"
					+"/item/findByItemId?id="+itemId;
					console.log(serverUrl);
					var vue=this;
					axios.get(serverUrl)
					.then(function(res){
						debugger;
						vue.item=res.data;
						//修改data中商品的分类id
						vue.itemCategoryId=vue.item.categoryId;
					})
					.catch();
				},
				findCategory:function(){
					//debugger;
					var serverUrl="http://localhost:1314/category/selectAll";
					var vue=this;
					axios.get(serverUrl)
					.then(function(res){
						//debugger;
						vue.categoryList=res.data;
					})
					.catch(function(e){
						window.alert("联网失败");
						console.log(e);
					});
				}
			},
			mounted:function(){
				console.log("mounted()");
				this.findCategory();
				//获取传过来的商品编号
				//?itemId=2
				var p=location.search;
				//itemId=2
				p=p.substr(1);
				var stringArray=p.split("=");
				var itemId=stringArray[1];
				console.log(itemId);
				this.findItemById(itemId);
			}
		}
		var vue=new Vue(config);
	</script>
</html>



